<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
<meta name="MobileOptimized" content="240" />
<meta http-equiv="pragma" content="no-cache"> 
<meta http-equiv="cache-control" content="no-cache,must-revalidate"> 
<meta http-equiv="expires" content="0">
<title>jQuery Mobile Web 应用程序</title>
<link href="css/jquery.mobile-1.4.5.min.css" rel="stylesheet"
	type="text/css" />
<link href="css/register_page.css" rel="stylesheet" type="text/css" />
<link href="css/reg_main_bg.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="js/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>

<!-- jquery实现注册跳转 -->

	
	

</head>

<body>

	<div data-role="page" id="reg_main_page" >

		<div data-role="header"  data-position="fixed" align="center" style="background-color: white">

				<h3>手机号登录</h3>
			
		</div>

		<div data-role="content" >


		<!-- 将JQuery代码放到内容中保证JS能够正常执行 -->
	<script type="text/javascript">
	
	//String函数之LTrim(),用于清除字符串开头的空格\换行符\回车等
	//Date:2006-06-20
	//@Param String(str)
	//@Return String
	//Begin
	//function ltrim(str) {
	//var pattern = new RegExp("^[\\s]+","gi");
	//return str.replace(pattern,"");
	//}
	//End

	//String函数之RTrim(),用于清除字符串结尾的空格\换行符\回车等
	//Date:2006-06-20
	//@Param String(str)
	//@Return String
	//Begin
	//function rtrim(str) {
	//var pattern = new RegExp("[\\s]+$","gi");
	//return str.replace(pattern,"");
	//}
	//End

	//String函数之Trim(),用于清除字符串开头和结尾部分的空格\换行符\回车等
	//组合调用LTrim(str)和RTrim(str)函数
	//Date:2006-06-20
	//@Param String(str)
	//@Return String
	//Begin
	//function trim(str) {
	//return rtrim(ltrim(str));
	//}
	//End
		$(document).ready(function(){
			
			//alert("---");
			
			var telText=$("#telNumber");//获取手机号文本对象
			var checkText=$("#checkCode");//获取验证码文本对象
			//获取验证码按钮对象
			var checkCodeBtn=$("#checkCodeBtn");
			
			//给手机号文本对象设置change事件
			var errPromptMsg=$("#errPromptMsg");//获取输入错误提示文本对象
			
			//定义一个标志位用表示手机号合法性
			var flag=false;
			telText.keyup(function(){
				
				//alert(telText.val());
				var telValue=telText.val();
				//alert(telValue);
				var rel= /^(13[0-9])|(15[012356789])|(18[056789])$/; //验证手机号段
			
				
				
				var re= /^(13[0-9]{9})|(15[012356789][0-9]{8})|(18[056789][0-9]{8})$/;//验证手机号合法性
				
				
				if(telValue.length!=11){
					
				
					if(telValue.length==3){
						
						if(rel.test(telValue)){
							errPromptMsg.html("手机号段可用");
							flag=false;
						}else{
							errPromptMsg.html("手机号段无效");
							flag=false;
						}
					}else{
						errPromptMsg.html("手机号不足11位");
						flag=false;
					}
					
				}else{
					errPromptMsg.html("");
					flag=true;
				}
				
				
				
			});
			
			
			var _time = 10;

			function timedown(t){

				//alert(t);
			if(_time == 0){

			t.removeAttr("disabled");


			t.val("获取验证码").button("refresh");

			_time = 10;

			}else{
				//t.val("111").button("refresh");
			t.attr("disabled", true);
			
			
			t.val(""+_time+"秒后再次获取").button("refresh");

			_time--;

			//setInterval("timedown");
			setTimeout(function() {
				//alert(t.val());
			timedown(t);

			},1000);

			}

			}


			


			


			
			
			checkCodeBtn.click(function(){
				
				if(flag){
					
					
				//alert(checkCodeBtn.val());
				timedown(checkCodeBtn);
				
				$.get("servlet/ValidateInfoServlet?type=getCheckCode");		
					
				}else{
					errPromptMsg.html("手机号码不合法，不能获取验证码");
				}
				
				
			});
			
			
		
			
		
			
			var v=$("#login").click(function(){
				//得到手机号和验证码
				var tel=telText.val();
				var check=checkText.val();
				//alert(tel.length,check.length);
				if((tel.length==11)&&(check.length==4)){
					
					//alert("-----");
					$.get("servlet/ValidateInfoServlet?type=login&tel="+tel+"&check="+check,"",function(data){
						
						var tmp=$.trim(data);
						
						if(tmp=="success"){
							//alert("成功---");
					 window.location.href="get_favorable.html";
							
						}else{
							
							//window.location.href="dialogPage";
							//alert("失败");
							$("#dialogPage").trigger("click");
							//window.showModelessDialog("reg_failure_custom_dialog_page.html",this);
							//window.open('reg_failure_custom_dialog_page.html','title','height=100,width=200,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no');
						}
						
						
					},"text");
				}else{
					
					errPromptMsg.html("手机号或验证码输入有误!");
				}
					
					
					
					
		});
			
			
		});
		
	
	</script>


			<form  method="post">
			<fieldset>
				
				<input type="tel" name="tel" placeholder="输入手机号" maxlength="11" id="telNumber"/><h6 id="errPromptMsg" align="center" style="color:red"></h6> 
				<input type="button" name="button" value="获取验证码" id="checkCodeBtn"/>
				<input type="text" name="checkCode" placeholder="输入验证码" maxlength="4" id="checkCode"/> 
				<input type="button" name="next" style="background-color: #F9F900; height: 80px"
					value="同意用户协议,登录"  id="login" />

			</fieldset>
			</form>
			<br><br>
			<div align="center">
				<a href="user_auth.html"
					style="color: #abf; text-decoration: none; font-size: small;">火锅地图用户服务协议</a><br><br><br>
					
					<a href="sort.html"
					style="color: #abf; text-decoration: none; font-size: small;" data-ajax="false">火锅地图排行榜</a>
					
					<a style="display:none" href="#userPage" id="dialogPage" data-rel="dialog" data-transition="slideup" data-ajax="true" ></a>
			</div>


			
			
		</div>

	</div>

	<div data-role="page" id="userPage" align="center">

		<div data-role="header" align="center">
		<p>错误提示</p>
		</div>

	<div data-role="content" align="center"> 
  <p style="color: red">手机号或者验证码有误，请重试！</p>
  <!--  <p><a href="#reg_main_page" data-icon="back" data-role="button" data-rel="back" data-theme="b" data-ajax="false" onclick="$('.ui-dialog').dialog('close'); return false;">关闭</a></p>  -->     
  
  
</div> 
		
	</div>


</body>

</html>
